<div class="row">
	<div class="col-md-12">
		<div class="table-header">
			Employee
		</div>
	<div id="dynamic-table_wrapper" class="dataTables_wrapper form-inline no-footer">
		<div class="row">
			<div class="col-xs-6">
				<div class="dataTables_length" id="dynamic-table_length">
					<label>Display 
						<select name="dynamic-table_length" aria-controls="dynamic-table" class="form-control input-sm">
							<option value="10">10</option>
							<option value="25">25</option>
							<option value="50">50</option>
							<option value="100">100</option>
						</select> records</label>
					</div>
				</div>
				<div class="col-xs-6">
					<div id="dynamic-table_filter" class="dataTables_filter">
						<label>
							Search:
							<input type="search" class="form-control input-sm" placeholder="" aria-controls="dynamic-table"></label>
						</div>
					</div>
				</div>
				<table id="dynamic-table" class="table table-striped table-bordered table-hover dataTable no-footer DTTT_selectable" role="grid" aria-describedby="dynamic-table_info">
					<thead>
						<tr role="row">
							<th class="center sorting_disabled" rowspan="1" colspan="1" aria-label="">
								<label class="pos-rel">
									<input type="checkbox" class="ace">
									<span class="lbl"></span>
								</label>
							</th>
							<th class="sorting" tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" aria-label="Domain: activate to sort column ascending">FirstName</th>
							<th class="sorting" tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" aria-label="Domain: activate to sort column ascending">LastName</th>
							<th class="sorting sort_width" tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" aria-label="Price: activate to sort column ascending">Company Name</th>
							<th  class="hidden-480 sort_width sorting" tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" aria-label="Clicks: activate to sort column ascending">Contact Person</th>
							
							<th class="sorting sort_width" tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" aria-label="Domain: activate to sort column ascending">Phone</th>								
							
							<th class="sorting" tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" aria-label="Domain: activate to sort column ascending">Type</th>								
														
							<th class="sorting_disabled" rowspan="1" colspan="1" aria-label="">Action</th>
						</tr>
				</thead>
				<tbody>	
				<?php 
					$i=1;
					$group_type = getUserType()->result();
					$arr_group_type = array();
					foreach($group_type as $arr_type){
						
						$arr_group_type[$arr_type->id] = $arr_type->name;
					}

					
				    foreach ($employee_data->result() as $key => $value) {


					?>

					<script type="text/javascript">
							$(document).ready(function(){
								$("#hiddeng_<?php echo $i; ?>").hide();
								$("#editEM_<?php echo $i; ?>").click(function(){
									$("#hiddeng_<?php echo $i; ?>").show();
									$("#view_<?php echo $i; ?>").hide();
								});
							});
					</script>
						<tr role="row" class="even" id="view_<?php echo $i; ?>">
							<td class="center">
								<label class="pos-rel">
									<input type="checkbox" class="ace">
									<span class="lbl"></span>
								</label>
							</td>
							<td>
								<?php echo $value->first_name; ?>
							</td>
							<td><?php echo $value->last_name; ?></td>
							<td><?php echo $value->company; ?></td>
							<td><?php echo $value->contact_person; ?></td>
							<td><?php echo $value->phone; ?></td>
							
							<td><?php echo $value->name; ?></td>
							<td>
								<div class="hidden-sm hidden-xs action-buttons">
									<a class="blue view_detail" href="#" id="<?php echo $value->id; ?>" data-toggle="modal" data-target="#myModal">
										<i class="ace-icon fa fa-search-plus bigger-130"></i>
									</a>

									<a class="green" id="editEM_<?php echo $i; ?>" href="#">
										<i class="ace-icon fa fa-pencil bigger-130"></i>
									</a>
									
									<?php echo anchor("admin_khmerhr/deleteEmployee/".$value->id,'<i class="ace-icon fa fa-trash-o bigger-130"></i>','class="red deleteEmployee"'); ?>
								</div>
								
							</td>
						</tr>
						<?php echo form_open("admin_khmerhr/updateUser/".$value->id,'class="form_updateUser"'); ?>
						<tr role="row" class="even" id="hiddeng_<?php echo $i; ?>">
							<td class="center">
								<label class="pos-rel">
									<input type="checkbox" class="ace">
									<span class="lbl"></span>
								</label>
							</td>
							<td>
								<?php echo form_input('firstName',$value->first_name,' class="form-control  sort_input input-sm"'); ?>
							</td>
							<td>
								<?php echo form_input('lastName',$value->last_name,'class="form-control sort_input input-sm"'); ?>
							</td>
							<td>	
								<?php echo form_input('companyName',$value->company,'class="form-control sort_input  input-sm"'); ?>
							</td>
							<td>
								<?php echo form_input('contactPerson',$value->contact_person,'class="form-control sort_input  input-sm"'); ?>
							</td>
							<td>
								<?php echo form_input('phone',$value->phone,'class="form-control sort_input input-sm "'); ?>
							</td>
							
							<td><?php echo form_dropdown('type',$arr_group_type,$value->id_type,'class="form-control sort_input input-sm"'); ?></td>
							<td>
								<div class="hidden-sm hidden-xs action-buttons">
									<button type="submit"><i class="ace-icon fa fa-pencil bigger-130"></i></button>
									<button><i class="glyphicon glyphicon-remove"></i></button>
								</div>
							</td>
						</tr>
						<?php echo form_close(); ?>
					<?php 
						$i++;
					 } 

					?>			
				
				</tbody>						
			</table>
			<div class="row">
				<div class="col-xs-6">
					<!-- <div class="dataTables_info" id="dynamic-table_info" role="status" aria-live="polite">
						Showing 1 to 10 of 23 entries
					</div> -->
				</div>
				<div class="col-xs-6">
					<!-- <div class="dataTables_paginate paging_simple_numbers" id="dynamic-table_paginate">
						<ul class="pagination">
							<li class="paginate_button previous disabled" aria-controls="dynamic-table" tabindex="0" id="dynamic-table_previous">
								<a href="#">Previous</a>
							</li>
							<li class="paginate_button active" aria-controls="dynamic-table" tabindex="0">
								<a href="#">1</a>
							</li>
							<li class="paginate_button " aria-controls="dynamic-table" tabindex="0">
								<a href="#">2</a>
							</li>
							<li class="paginate_button " aria-controls="dynamic-table" tabindex="0">
								<a href="">3</a>
							</li>
							<li class="paginate_button next" aria-controls="dynamic-table" tabindex="0" id="dynamic-table_next">
								<a href="#">Next</a>
							</li>
						</ul>
					</div> -->
					<?php echo $links; ?>
				</div>
			</div>
		</div>
			
	</div>
</div>

<script type="text/javascript">
	$(document).ready(function(){
		
		$(".view_detail").click(function(){
			var id= $(this).get(0).id;
			var html = "";
			var userName="";
			$.ajax({
				type:"POST",
				url:"<?php echo base_url(); ?>index.php/admin_khmerhr/viewDetailUser/"+id,
				data:{id:id},
				success:function(respone){
					$.each(respone,function(key,value){
						userName = value['first_name']+' '+value['last_name'];
						html += '<table class="table table-bordered">';
         				html +='<tr>';
         				html +='<td>First Name</td>';
         				html +='<td>:</td>';
         				html +='<td>'+value['first_name']+'</td>';
         				html += '</tr>';
         				html +='<tr>';
         				html +='<td>Last Name</td>';
         				html +='<td>:</td>';
         				html +='<td>'+value['last_name']+'</td>';
         				html +='</tr>';
         				html +='<tr>';
         				html +='<td>Email</td>';
         				html +='<td>:</td>';
         				html +='<td>'+value['email']+'</td>';
         				html +='</tr>';
         				html +='<tr>';
         				html +='<td>Phone</td>';
         				html +='<td>:</td>';
         				html +='<td>'+value['phone']+'</td>';
         				html +='</tr>';
         				html +='<tr>';
         				html +='<td>Position</td>';
         				html +='<td>:</td>';
         				html +='<td>'+value['name']+'</td>';
         				html +='</tr>';	
         				html +='<tr>';
         				html +='<td>Company</td>';
         				html +='<td>:</td>';
         				html +='<td>'+value['company']+'</td>';
         				html +='</tr>';
         				html +='<tr>';
         				html +='<td>Contact Person</td>';
         				html +='<td>:</td>';
         				html +='<td>'+value['contact_person']+'</td>';
         				html +='</tr>';	
         				html +='</table>';
         				$("#viewDetailUser").html(html);
         				$("#nameUser").html(userName);
					})	
				}
			});
		});
	});

</script>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="nameUser" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="nameUser"></h4>
      </div>
      <div class="modal-body" id="viewDetailUser">
         
      </div>
      <!-- <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div> -->
    </div>
  </div>
</div>